/**
 * Created by Eric on 14-1-5.
 */
define(function (require, exports, module) {
    var fields = [
        {field: 'id', title: '用户ID', width: 60, align: 'center'},
        {field: 'name', title: '用户名称', width: 150, align: 'center'},
        {field: 'type', title: '电话号码', width: 150, align: 'center'},
        {field: 'desc', title: '描述', align: 'center'}
    ]
    var pageViews = [ 'linkNav', 'dialog', 'from', 'table', 'pagination'];

    module.exports = {
        views: pageViews,
        views_pagination: {
            target: '#PaginationV2',
            widgets: 'pagination',
            options: {
                beforePageText: '到第',
                afterPageText: '页，总页数{pages}。',
                displayMsg: '记录数共{total}条 ',
                links: 5,
                pageList: [1, 10, 20, 30],
                layout: ['list', 'sep', 'first', 'prev', 'links', 'next', 'last', 'sep', 'refresh', 'sep', 'manual'],
                url: '/api/users',
                urlTemp: ['/api/users', '?page=', 1, '&rows=', 10, '&needTotal=', true]
            },
            listener2: function (jQuery) {
                var tabHandler = jQuery('#testTab');
                var pageHandler = jQuery('#PaginationV2');
                var pageOptions = pageHandler.pagination('options');
                pageHandler.pagination({
                    onSelectPage: function (pageNumber, pageSize) {
                        pageHandler.pagination('loading');
                        tabHandler.datagrid('loading');
                        pageOptions.urlTemp[2] = pageNumber;
                        pageOptions.urlTemp[4] = pageSize;
                        var url = pageOptions.urlTemp.join('');
                        jQuery.getJSON(url, function (jsonData) {
                            console.log(jsonData);
                            if (typeof jsonData['data'] != 'undefined') {
                                tabHandler.datagrid({data: jsonData.data});
                                if (typeof  jsonData['total'] != 'undefined') {
                                    jQuery.extend(pageOptions, {total: jsonData.total});
                                }
                            } else {
                                tabHandler.datagrid({data: jsonData});
                            }

                            console.log('set data finished');
                            pageHandler.pagination('loaded');
                            pageHandler.pagination('refresh');
                            tabHandler.datagrid('loaded');
                        });

                    }});

                pageHandler.pagination('select');
            },
            layout: {
                belongTo: function ($) {
                    $("#PaginationV2").appendTo($('#testTab').datagrid('getPanel'));
                }
            }
        },
        views_linkNav: {
            target: '#linkNav',
            html: {
                tag: 'div',
                sub: [
                    {
                        tag: 'a',
                        attr: {id: 'tabAddBtn', href: '#', 'data-options': "iconCls:'icon-add',plain:'true'"},
                        content: '  添加   '
                    },
                    {
                        tag: 'a',
                        attr: {id: 'tabEditBtn', href: '#', 'data-options': "iconCls:'icon-edit',plain:'true'"},
                        sub: {
                            tag: 'h2',
                            content: '编辑'
                        }
                    }
                    ,
                    {
                        tag: 'a',
                        attr: {id: 'tabDelBtn', href: '#', 'data-options': "iconCls:'icon-remove',plain:'true'"},
                        content: '<span>  删  除<sup>2</sup>   </span> '
                    }
                ]
            },
            layout: {
                belongTo: 'body'
            },
            listener: function ($) {
                $('#linkNav > a').each(function (i, data) {
                    console.log(data);
                    var handler = $(data);
                    var icon = handler.attr('iconCls');
                    handler.linkbutton({iconCls: icon});
                });

                $("#tabAddBtn").bind('click', function (e) {
                    $('#addPanel').dialog('open');
                });
                $("#tabEditBtn").bind('click', function (e) {
                    alert('bbbbb');
                });
                $("#tabDelBtn").bind('click', function (e) {
                    alert('cccccc');
                });
            }
        },
        views_table: {
            target: '#testTab',
            widgets: 'datagrid',
            options: {
                columns: [fields],
                target: '#testTab',
                method: 'get',
                //  url: '/api/users',
                autoRowHeight: false,
                fitColumns: true,
                pagination: false,
                singleSelect: true,
                scrollbarSize: 1,
                loadMsg: '努力加载中...',
                idFieldL: 'id',
                toolbar: '#linkNav',
                onLoadSuccess: function (param) {
                    console.log(param);
                    return false;
                }
            },
            hasCustomerProcesses:[
                 'wrapWidgetHtml', 'craeteWidgets','printCustomerProcess'
            ],
            printCustomerProcess:function(options)
            {
              console.log("#####printCustomerProcess#####");
              console.log(options);
            },
            listener2: function ($) {
                $('#testTab').datagrid(
                    {
                        toolbar: [
                            {
                                iconCls: 'icon-add',
                                handler: function () {
                                    $('#addPanel').dialog('open');
                                }

                            },
                            {
                                iconCls: 'icon-edit',
                                handler: function () {
                                    alert('edit');
                                }
                            },
                            '-',
                            {
                                iconCls: 'icon-remove',
                                handler: function () {
                                    alert('edit');
                                }
                            }
                        ]
                    });
            }
        },
        views_from: {
            target: '#addForm',
           // widgets: 'ajaxSubmit',
            options: {
                url: '/api/user/$id',
                target: '#addForm',
                type: 'POST',
                dataType: 'json',
                clearForm: true,
                contentType:'text/plain',
                beforeSubmit: function (formData, jqForm, options) {
                    return true;
                },
                success: function (data, statusText) {
                    console.log("submit success.");
                }
            },
            layout: {
                belongTo: '#insertForm'
            },
            html: function ($) {
                var target = '#addForm';
                var wrapTarget = $(target);
                var el = $.element;
                $.each(fields, function (i, fieldData) {
                    console.log(fieldData);
                    el.div({ className: 'fitem' },
                        el.label({  htmlFor: fieldData.field + '-input' },
                            fieldData.title + ' :'
                        ),
                        el.input({id: fieldData.field + '-input', name: fieldData.field, type: 'text', required: 'true'})
                    ).appendTo(target);
                });
            }
        },
        views_dialog: {
            target: '#addPanel',
            widgets: 'dialog',
            options: {
                title: '用户信息',
                width: 450,
                height: 250,
                closed: true,
                cache: false,
                resizable: true,
                modal: true
            },
            listener: function ($) {
                $('#addPanel').dialog({
                    buttons: [
                        {
                            text: '保存',
                            handler: function () {
                                var formOptions = {};
                                var cacheData = $('#addForm').data("cache-options");
                                $.extend(formOptions,{ columns: fields},cacheData);
                                $('#addForm').ajaxSubmit(formOptions);
                                $('#addPanel').dialog('close'); // close the dialog
                                $('#testTab').datagrid('reload'); // reload the user data
                            }
                        },
                        {
                            text: '关闭',
                            handler: function () {
                                $('#addPanel').dialog('close'); // close the dialog
                                $('#testTab').datagrid('reload'); // reload the user data
                            }
                        }
                    ]
                });
            }
        }
    }

});